<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>html中dom事件的触发等级</title>
		<!-- <script type="text/javascript" src="js/html中dom事件的触发等级.js"></script><!-- 使用js连接的id对象获取同样也会报错 --> 
	</head>
	<body>
		<!-- 事件句柄 -->
		<!-- 是指事件发生时要进行的操作。
		 （又称事件处理函数），每一个事件均对应一个事件句柄，在程序执行时，将相应的函数或语句指定给事件句柄，则在该事件发生时，
		 浏览器便执行指定的函数或语句，从而实现网页内容与用户操作的交互。
		 当浏览器检测到某事件发生时，便查找该事件对应的事件句柄有没有被赋值，如果有，则执行该事件句柄。-->
		
		<script type="text/javascript">
// 			var obj = document.getElementById("btn");//单写这一个是不会报错的,但是该对象实际上依然是没有获取到的.
// 			console.log(obj);//显示为null
		</script>
		<button id="btn" type="button" onclick="console.log('dom level0')">点击事件</button>
		<script type="text/javascript">
			/* element.removeEventListener(event,function,useCapture)
			 1.event:要移除的事件名称。
			 2.function:指定要移除的函数。
			 3.useCapture:(可选)	true-在捕获阶段移除事件句柄
								false-默认-在冒泡阶段移除事件句柄*/
			
			
			
// 			document.getElementById("btn").onclick = function(){
// 				console.log("dom level2");
// 			}//当点击按钮时调试日志只输出了"dom level2",js编辑的事件将html标签中内嵌的js事件覆盖掉了
			//如果将此js放置在获取对象的前面的话,会报该对象没有onclick属性
			document.getElementById("btn").addEventListener('click',function(e){
				console.log("dom level2");
				document.getElementById("btn").removeEventListener(e.type,arguments.callee,false);
			});
			document.getElementById("btn").addEventListener("click",function(){
				console.log("dom level2 again");
			});
			
			
			//如果不去除.onclick绑定的匿名函数,其结果为:
			//	=>	dom level2	//.onclick 的匿名函数依然会覆盖标签中写的onclick事件
			//		dom level2
			//		dom level2 again
			
			/* 	addEventListener()
				removeEventListener()*/
				
				
				
				
				
			/* 	attachEvent()
				detachEvent()
				*/
			/* document.getElementById("btn").attachEvent("onclick",function(){
				console.log("IE level dom2")//attachEvent()函数仅支持Ie8之前的版本，先以由addEventListener()函数代替。
			}); */
			
			
			/* 	IE11 添加、更改、删除了许多默认的传统功能：
				navigator.appName 属性现在会返回 "Netscape" 以反映 HTML5 标准和匹配其他浏览器的行为。
				navigator.product 属性现在会返回 "Gecko" 以便反映 HTML5 标准和匹配其他浏览器的行为。
				XDomainRequest 对象被 XMLHttpRequest 的 ORS 替换。
				已添加对 __proto__ 的支持。
				已添加 dataset 属性。
				另外，为了支持现行标准指定的功能，已删除若干传统 API 功能：

				删除 API 功能    替代功能    
				attachEvent    addEventListener    
				window.execScript    eval    
				window.doScroll    window.scrollLeft、window.scrollTop    
				document.all    document.getElementById    
				document.fileSize、img.fileSize    使用 XMLHttpRequest 可提取源    
				script.onreadystatechange 和 script.readyState    script.onload    
				document.selection    window.getSelection    
				document.createStyleSheet    document.createElement("style")    
				style.styleSheet    style.sheet    
				window.createPopup    使用 div 或 iframe（zIndex 值很高）    
				二进制行为    变化；使用基于标准的等效，如 canvas、SVG 或 CSS3 动画    
				传统数据绑定    使用框架提供的数据绑定，如 WinJS     */
				
				
			/* addEventListener()的事件属性 */
				
				/* 
				 
				 
				 */
		</script>
		
	</body>
</html>
